<template>
  <view class="page">
    <view class="page-box">
      <u-avatar v-if="userInfo.avatar" :src="userInfo.avatar" size="100" />
      <u-avatar v-else size="100" />
      <view v-if="userInfo.nickname">
        {{ userInfo.nickname }}
      </view>
      <view v-if="mobile">
        {{ mobile }}
      </view>
      <button
        open-type="getPhoneNumber"
        class="button"
        @getphonenumber="getPhoneNumber"
        size="mini"
      >
        获取微信授权
      </button>
    </view>
    <Wx-login v-model="showPop" @cencel="cencelPopup" @confirm="handleBind" />
  </view>
</template>
<script>
import WxLogin from "@/components/Author/index";
import { weixinLogin, myProInfo, myPhone, myMemberCard } from "@/request/myApi.js";
export default {
  components: { WxLogin },
  data() {
    return {
      showPop: false, // 完善信息
      userInfo: {}, // 用户信息
      mobile: "", // 手机号码
      token: "",
      cardList: [], // 会员列表
    };
  },
  created() {
    this.getMemberList();
  },
  methods: {
    // 关闭授权弹窗
    cencelPopup(v) {
      this.showPop = false;
    },
    // 登录
    handleLogin() {
      uni.login({
        success: (loginRes) => {
          let data = {
            platform: "mp_weixin",
            loginData: loginRes,
            client_id: null,
          };
          weixinLogin(data).then((res) => {
            if (res.code == 1) {
              if (res.data.binding == 0) {
                this.showPop = true;
                this.token = res.data.token;
                uni.setStorageSync("TOKEN", res.data.token);
              } else {
                this.userInfo = res.data.userinfo;
                // 会员信息
                let member = this.cardList.find((i) => i.id == this.userInfo.level);
                if (
                  member &&
                  (this.userInfo.member_expire_time == -1 ||
                    this.userInfo.member_expire_time > new Date().getTime() / 1000)
                ) {
                  this.userInfo.isPlus = true;
                  this.userInfo.memberImg = member.cover_img;
                  this.userInfo.memberId = member.id;
                  this.userInfo.memberName = member.name;
                  this.userInfo.memberRebate = member.rebate;
                }
                uni.setStorageSync("USER_INFO", JSON.stringify(this.userInfo));
                uni.setStorageSync("TOKEN", res.data.userinfo.token);
                uni.showLoading({
                  title: "登录中...",
                  mask: true,
                });
                setTimeout(() => {
                  uni.hideLoading();
                  if (uni.getStorageSync("qr")) {
                    uni.removeStorageSync("qr");
                    uni.navigateBack({ delta: 1 });
                  } else {
                    uni.switchTab({ url: "/pages/tabBar/homeIndex" });
                  }
                }, 1000);
              }
            }
          });
        },
      });
    },
    // 获取code
    getPhoneNumber(e) {
      let data = {
        code: e.detail.code,
      };
      myPhone(data).then((res) => {
        if (res.code == 1) {
          this.mobile = res.data.mobile;
          this.handleLogin();
        }
      });
    },
    // 完善账号
    handleBind(val) {
      let data = {
        token: this.token,
        avatarUrl: val.avatarUrl,
        nickName: val.nickname,
        mobile: this.mobile,
      };
      myProInfo(data).then((res) => {
        if (res.code == 1) {
          this.userInfo = res.data.userinfo;
          // 会员信息
          let member = this.cardList.find((i) => i.id == this.userInfo.level);
          if (
            member &&
            (this.userInfo.member_expire_time == -1 ||
              this.userInfo.member_expire_time > new Date().getTime() / 1000)
          ) {
            this.userInfo.isPlus = true;
            this.userInfo.memberImg = member.cover_img;
            this.userInfo.memberId = member.id;
            this.userInfo.memberName = member.name;
            this.userInfo.memberRebate = member.rebate;
          }
          uni.setStorageSync("USER_INFO", JSON.stringify(this.userInfo));
          uni.setStorageSync("TOKEN", res.data.userinfo.token);
          uni.navigateTo({ url: "/pages/bind/bindPhone" });
          this.showPop = false;
        }
      });
    },
    // 获取会员信息
    getMemberList() {
      myMemberCard().then((res) => {
        if (res.code == 1) {
          res.data.forEach((i) => {
            i.cover_img = i.cover_img || this.webSrc("/assets/web_img/my/member1.png");
          });
          this.cardList = res.data;
        }
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.page {
  padding: 20rpx;
  &-box {
    height: 500rpx;
    margin: 200rpx auto;
    width: 500rpx;
    display: flex;
    text-align: center;
    flex-direction: column;
    justify-items: center;
    > view {
      margin-bottom: 60rpx;
    }
    .btn {
      font-size: 28rpx;
      background-color: #fff;
      border: 1rpx solid #dddddd;
      padding: 20rpx;
      border-radius: 8rpx;
      &:active {
        background-color: #f2f2f2;
      }
    }
  }
}
/deep/ .u-avatar {
  margin: 0 auto;
  margin-bottom: 60rpx;
}
.button {
  background-color: #3ba199;
  width: 100%;
  color: #fff;
  border-radius: 40rpx;
  height: 60rpx;
  line-height: 60rpx;
}
</style>
